<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>价格列表</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../css/oksub.css">
	<script type="text/javascript" src="../../lib/loading/okLoading.js"></script>
	<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
	<meta http-equiv="refresh" content="60">


</head>
<body>
	<!--模糊搜索区域-->
	<div class="layui-row">
		<form class="layui-form ok-search-form">
			<div class="layui-form-item">

				<div class="layui-inline">
					<label class="layui-form-label">请选择状态</label>
					<div class="layui-input-inline">
						<select name="operator" lay-verify="" lay-search>
							<option value="" selected>请选择状态</option>
							<option value="0">移动</option>
							<option value="1">电信</option>
							<option value="2">联通</option>
							<option value="3">电费</option>
							<option value="4">油卡</option>
							<option value="5">会员</option>
						</select>
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<button class="layui-btn" lay-submit=""  lay-filter="search">搜索
							<i class="layui-icon">&#xe615;</i>
						</button>
<!--							<a class="layui-btn layui-inline fl w130" lay-event="add">添加</a>-->
					</div>
				</div>
			</div>
		</form>
	</div>
	<br>
	<!--数据表格-->
	<!-- <table class="layui-hide" id="tableId" lay-filter="tableFilter"></table> -->
	<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>

	layui.use(["element", "table", "form", "laydate", "okLayer", "okUtils", "okMock"], function () {
		let table = layui.table;
		let form = layui.form;
		let laydate = layui.laydate;
		let okLayer = layui.okLayer;
		let okUtils = layui.okUtils;
		let okMock = layui.okMock;
		okLoading.close();

		// laydate.render({elem: "#startTime", type: "datetime"});
		// laydate.render({elem: "#endTime", type: "datetime"});

		table.render({
			elem: "#tableId",
			url: "/credit/selall",
			limit: 10,
			page: true,
			toolbar: "#toolbarTpl",
			size: "sm",
			cols: [[
				{field: "id", title: "ID",width: 110,align: "center"},
				{field: "originalcost", title: "原价金额",width: 150,align: "center"},
				{field: "currentprice", title: "实付金额",width: 150,align: "center"},
				{field: "operator", title: "运营商",width: 150,align: "center"},
				{title: "操作", width: 180, align: "left", templet: "#operationTpl"}
			]],

			done: function (res, curr, count) {
			}

		});
		form.on("submit(search)", function (data) {
			var result = data.field;
			table.reload('tableId',{
				// where: data.field,
				// page: {curr: curr},
				page: {
					curr: 1
				}
				, where: {
					operator: result.operator
				}
			}, 'data');

			return false;
		});

		table.on("toolbar(tableFilter)", function (obj) {
			switch (obj.event) {
				case "batchDel":
					add();
					break;
			}
		});
		table.on("tool(tableFilter)", function (obj) {
			let data = obj.data;
			switch (obj.event) {
				case "update":
					update(data);
					break;
				case "add":
					add();
					break;
				case "dupd":
					dupd(data.id);
					break;
			}
		});
		function update(data) {
			var index = layer.open({
				title: '编辑用户',
				type: 2,
				shade: 0.2,
				maxmin:true,
				shadeClose: true,
				area: ['400px', '360px'],
				content: 'p-add.html',
				success:function (layero, index) {
					// articleTable.reload(),
					var body = layer.getChildFrame('body', index);
					var iframeWin = window[layero.find('iframe')[0]['name']];
					body.find("input[name='id']").val(data.id)
					body.find("input[name='originalcost']").val(data.originalcost)
					body.find("input[name='currentprice']").val(data.currentprice)
				},
				end:function(){
					location.reload();//弹出层结束后，刷新主页面
				}
			})

		}

		function add() {
			var index=layer.open({
				type: 1,
				skin: 'layui-layer-rim', //加上边框
				area: ['400px', '360px'], //宽高
				content:
						'<div>\n' +
						'<form class="layui-form" action="addp">\n' +
						'    <div class="layui-form-item">\n' +
						'        <label class="layui-form-label">运营商</label>\n' +
						'        <div class="layui-input-block">\n' +
						'<select name="operator" lay-verify="">'+
							'<option value="0">移动</option>'+
							'<option value="1">电信</option>'+
							'<option value="2">联通</option>'+
						'<option value="3">电费</option>'+
						'<option value="4">油卡</option>'+
						'<option value="5">影视会员</option>'+
						'</select>'+
						'        </div>\n' +
						'    </div>\n' +
						'    <div class="layui-form-item">\n' +
						'        <label class="layui-form-label">原价金额</label>\n' +
						'        <div class="layui-input-inline">\n' +
						'            <input type="text" name="originalcost" required lay-verify="required" placeholder="请输入原价金额" class="layui-input">\n' +
						'        </div>\n' +
						'    </div>\n' +
						'    <div class="layui-form-item">\n' +
						'        <label class="layui-form-label">实付金额</label>\n' +
						'        <div class="layui-input-inline">\n' +
						'            <input type="text" name="currentprice" required lay-verify="required" placeholder="请输入实际金额"  class="layui-input">\n' +
						'        </div>\n' +
						'    </div>\n' +

						'    <div class="layui-form-item">\n' +
						'        <div class="layui-input-block">\n' +
						'            <button type="button" class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>\n' +
						'            <button type="reset" class="layui-btn layui-btn-primary">重置</button>\n' +
						'        </div>\n' +
						'    </div>\n' +
						'</form>\n' +
						'</div>'
			});

				form.render('select');
				form.on('submit(formDemo)', function(data){
					layer.msg(JSON.stringify(data.field));
					console.log(data.field)
						okUtils.ajax("/credit/add", "post", data.field, true).done(function (response) {
							okLayer.greenTickMsg(response.msg, function () {
								console.log(index)
								parent.layer.close(index);
								table.reload('tableId',{
									// where: data.field,
									// page: {curr: curr},
									page: {
										curr: 1
									}
									// , where: {
									// 	operator: result.operator
									// }
								}, 'data');
							});
							// okUtils.tableSuccessMsg(response.msg);
							// table.reload();
							// return false;

						}).fail(function (error) {
							console.log(error)
						});


					return false;
				});


		}
		function dupd(id) {
			okLayer.confirm("确定对数据进行删除吗？", function () {
				okUtils.ajax("/credit/del", "post", {id: id}, true).done(function (response) {
					okUtils.tableSuccessMsg(response.msg);
					table.reload('tableId',{
						// where: data.field,
						// page: {curr: curr},
						page: {
							curr: 1
						}
						// , where: {
						// 	operator: result.operator
						// }
					}, 'data');
					return false;
				}).fail(function (error) {
					console.log(error)
				});
			})
		}
	})
</script>
<!-- 头工具栏模板 -->
<script type="text/html" id="toolbarTpl">
	<div class="layui-btn-container">
		<div class="layui-inline" lay-event="batchDel"><i class="layui-icon layui-icon-add-1"></i></div>
	</div>
</script>
<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
	<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="dupd" >删除</a>
	<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="update">修改</a>
</script>
<script type="text/javascript">
	layui.use('form', function(){
		var form = layui.form;
		form.render('select');
	});
</script>

</body>
</html>
